
import 'package:flutter/material.dart';
import 'package:yp/helper.dart';
import 'package:fluttertoast/fluttertoast.dart';
import 'package:get/get.dart';
import 'package:oktoast/oktoast.dart';

import 'logic.dart';
import 'state.dart';

class GiftCardBindingPage extends StatefulWidget {

  @override
  State<StatefulWidget> createState() {
    return _GiftCardBindingPage();
  }
}

class _GiftCardBindingPage extends State<GiftCardBindingPage> {
  final GiftCardBindingLogic logic = Get.put(GiftCardBindingLogic());
  final GiftCardBindingState state = Get.find<GiftCardBindingLogic>().state;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        centerTitle: true,
        elevation: 0,
        backgroundColor: Color(0xff0F0B0A),
        brightness: Brightness.dark,
        title: Text(
          '154****321 礼品卡',
          style: TextStyle(
            color: Colors.white,
            fontSize: 17,
          ),
        ),
        iconTheme: IconThemeData(
          color: Colors.white,
        ),
      ),
      body: GetBuilder<GiftCardBindingLogic>(
        builder: (logic) {
          return Container(
            color: Color(0xffF5F5F5),
            child: Column(
              children: [
                Expanded(
                  child: Container(
                    child: Column(
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Container(
                          height: setWidth(120),
                          padding: EdgeInsets.symmetric(horizontal: setWidth(26)),
                          decoration: BoxDecoration(
                            color: Colors.white,
                            border: Border.all(
                              color: Color(0xffefefef),
                              width: setWidth(1),
                            ),
                          ),
                          child: Row(
                            crossAxisAlignment: CrossAxisAlignment.center,
                            children: [
                              Text(
                                '礼品卡卡号',
                                style: TextStyle(
                                  color: Color(0xff666666),
                                  fontSize: 14,
                                ),
                              ),
                              SizedBox(
                                width: setWidth(34),
                              ),
                              Expanded(
                                child: Container(
                                  child: TextField(
                                    controller: state.cardNumberController,
                                    focusNode: state.cardNumberFocusNode,
                                    maxLines: 1,
                                    style: TextStyle(
                                      color: Color(0xff222222),
                                      fontSize: 14,
                                    ),
                                    keyboardType: TextInputType.phone,
                                    onChanged: (text) {
                                      logic.onBindingBoolClick();
                                    },
                                    decoration: InputDecoration(
                                      contentPadding: EdgeInsets.all(0),
                                      hintText: '请输入19位礼品卡号',
                                      hintStyle: TextStyle(
                                        color: Color(0xffcccccc),
                                        fontSize: 14,
                                      ),
                                      focusedBorder: InputBorder.none,
                                      enabledBorder: InputBorder.none,
                                    ),
                                  ),
                                ),
                              ),
                            ],
                          ),
                        ),
                        Container(
                          height: setWidth(120),
                          padding: EdgeInsets.symmetric(horizontal: setWidth(26)),
                          color: Colors.white,
                          child: Row(
                            crossAxisAlignment: CrossAxisAlignment.center,
                            children: [
                              Text(
                                '礼品卡密码',
                                style: TextStyle(
                                  color: Color(0xff666666),
                                  fontSize: 14,
                                ),
                              ),
                              SizedBox(
                                width: setWidth(34),
                              ),
                              Expanded(
                                child: Container(
                                  child: TextField(
                                    controller: state.passwordController,
                                    focusNode: state.passwordFocusNode,
                                    maxLines: 1,
                                    style: TextStyle(
                                      color: Color(0xff222222),
                                      fontSize: 14,
                                    ),
                                    keyboardType: TextInputType.phone,
                                    onChanged: (text) {
                                      logic.onBindingBoolClick();
                                    },
                                    decoration: InputDecoration(
                                      contentPadding: EdgeInsets.all(0),
                                      hintText: '请输入6位密码',
                                      hintStyle: TextStyle(
                                        color: Color(0xffcccccc),
                                        fontSize: 14,
                                      ),
                                      focusedBorder: InputBorder.none,
                                      enabledBorder: InputBorder.none,
                                    ),
                                  ),
                                ),
                              ),
                            ],
                          ),
                        ),
                      ],
                    ),
                  ),
                ),
                Text(
                  '绑定的线下实体卡，只能自己账户使用，无法转赠',
                  style: TextStyle(
                    color: Color(0xffcccccc),
                    fontSize: 11,
                  ),
                ),
                SizedBox(
                  height: setWidth(30),
                ),
                InkWell(
                  onTap: () {
                    if (state.bindingBool) {
                      print('立即绑定 点击事件 ！！！');
                      showToast(
                        '！！绑定 成功！！',
                        textPadding: EdgeInsets.symmetric(horizontal: setWidth(80), vertical: setWidth(40)),
                      );
                    } else {
                      print('不支持  立即绑定  点击事件 ！！！');
                      FToast fToast = FToast();
                      fToast.init(context);
                      fToast.showToast(
                        child: Container(
                          color: Colors.greenAccent,
                          child: Row(
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: [
                              Icon(
                                Icons.access_alarm,
                                color: Colors.red,
                                size: 15,
                              ),
                              SizedBox(
                                width: 5,
                              ),
                              Text(
                                '不支持  立即绑定',
                                style: TextStyle(
                                  color: Colors.yellow,
                                  fontSize: 15,
                                ),
                              ),
                            ],
                          ),
                        ),
                        gravity: ToastGravity.BOTTOM,
                        toastDuration: Duration(seconds: 2),
                      );
                    }
                  },
                  child: Container(
                    height: setWidth(90),
                    color: state.bindingBool ? Color(0xffC9A051) : Color(0xffcccccc),
                    alignment: Alignment.center,
                    child: Text(
                      '立即绑定',
                      style: TextStyle(
                        color: Colors.white,
                        fontSize: 18,
                      ),
                    ),
                  ),
                ),
              ],
            ),
          );
        },
      ),

    );
  }
}